<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../../common/jsp/taglibs.jsp"%>
<!-- 
    Copyright (C)  2011  chen wei hua.
    Permission is granted to copy, distribute and/or modify this document
    under the terms of the GNU Free Documentation License, Version 2.0
    or any later version published by the Free Software Foundation;
    with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts.
    A copy of the license is included in the section entitled "GNU Free Documentation License".
 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>原料需求</TITLE>
<%@ include file="../../common/jsp/config.jsp"%>
<%@ include file="../../common/jsp/validate.jsp"%>
<%@ include file="../../common/jsp/autocomplete.jsp"%>
<script type="text/javascript" src="common/js/calendar/WdatePicker.js" ></script>
<script type="text/javascript" language="javascript">
var productNamesIndex = 0;
function addLine() {
	productNamesIndex++;
	var productTable = $("#productList");
	productTable.find("tr").last().before(
	           '<tr class="odd">'
	          +'<td><span id="materialsCodes-'+productNamesIndex+'"></span></td>'
	          +'<td><span id="materialsCategorysSpan-'+productNamesIndex+'"></span><s:hidden id="materialsCategorys-'+productNamesIndex+'" name="materialsCategorys" /></td>'
	          +'<td><s:textfield id="materialsNames-'+productNamesIndex+'" name="materialsNames" size="20" cssClass="{required:true,maxlength:20}"/><s:hidden id="materialsIds-'+productNamesIndex+'" name="materialsIds" /></td>'
	          +'<td><span id="materialsPropertys-'+productNamesIndex+'"></span></td>'
	          +'<td><span id="materialsNumbers-'+productNamesIndex+'"></span></td>'
	          +'<td><span id="materialsSafeNumbers-'+productNamesIndex+'"></span></td>'
	          +'<td><span id="materialsUnits-'+productNamesIndex+'"></span></td>'
	          +'<td><s:textfield id="planNumbers-'+productNamesIndex+'" name="planNumbers" size="10" cssClass="{required:true,maxlength:10,number:true}" /></td>'
	          +'<td><s:textfield id="finishDates-'+productNamesIndex+'" name="finishDates" size="10" onclick="showDatePicker()" readonly="true" cssClass="{required:true}"/></td>'
	          +'<td><input type="button" value="删除" class="input1" onclick="deleteLine(this)" /></td>'
	          +'</tr>');
	initMaterialsAutoSelected(productNamesIndex);
}

function showDatePicker() {
	WdatePicker({dateFmt:'yyyy-MM-dd'});
}

function deleteLine(button) {
	$(button).parent().parent().remove();
}

function initMaterialsAutoSelected(id) {
	$("#materialsNames-" + id).each(function(i) {
		$(this).autocomplete("queryMaterialsNames.action", {
			width: 300,
			max: 10,
			autoFill: false,
			dataType: "json",
			parse: function(data) {
				var parsed = [];
				var rows = data.materialsList;
				for (var i=0; i < rows.length; i++) {
					var row = rows[i];
					if (row) {
						parsed[parsed.length] = {
							data: row,
							value: row.id,
							result: row.name//最终选择后显示的内容
						};
					}
				}
				return parsed;
			},
			formatItem: function(row, i, max) {
				return row.code + " " + row.name + " " + row.property;//列表中显示的值
			}
		}).result(function(e, row) {
			var target = e.target;
			var id = target.id.split("-")[1];
			$("#materialsIds-" + id).val(row.id);
			$("#materialsCodes-" + id).html(row.code);
			$("#materialsCategorys-" + id).val(row.categoryName);
			$("#materialsCategorysSpan-" + id).html(row.categoryName);
			$("#materialsPropertys-" + id).html(row.property);
			$("#materialsNumbers-" + id).html(row.number);
			$("#materialsSafeNumbers-" + id).html(row.safeNumber);
			$("#materialsUnits-" + id).html(row.units);
		});
	});
}

$(document).ready(function() {
	$("#saveMaterialsRequest").validate();
	initMaterialsAutoSelected(productNamesIndex);
});
</script>
</HEAD>
<BODY>
    <div class="subnav" align="left">
        <table width="100%" border="0" cellspacing="0" cellpadding="0">
		  <tr>
			<td width="100%" align="left" height="31">&nbsp;<img src="common/images/title-pk.gif" border="0"  align="absmiddle"/>&nbsp;<span class="subnavtxt1">采购管理</span>
			&nbsp;<img src="common/images/leftico2.gif" border="0"  align="absmiddle"/>&nbsp;<span class="subnavtxt2">原料需求信息</span></td>
		  </tr>
		</table>
    </div>
     <div class="main_1">
       <table width="99%" border="0" cellpadding="10" cellspacing="1" bgcolor="#D3DEEF">
         <tr>
           <td align="left" class="Blue14" bgcolor="#FAFAFA" colspan="4">订单信息</td>
         </tr>
         <tr>
		    <td width="20%" bgcolor="#FAFAFA" align="right"><strong>签订日期</strong></td>
		    <td width="30%" bgcolor="#FAFAFA"><s:date name="order.orderDate" format="yyyy-MM-dd"/></td>
		    <td width="20%" bgcolor="#FAFAFA" align="right"><strong>客户名称</strong></td>
	        <td width="30%" bgcolor="#FAFAFA"><s:property value="order.customName"/></td>
		 </tr>
		<tr>
	      <td bgcolor="#FAFAFA" align="right"><strong>订单号</strong></td>
	      <td bgcolor="#FAFAFA"><s:property value="order.contractNo"/></td>
	      <td bgcolor="#FAFAFA" align="right"><strong>预出货日期</strong></td>
	      <td bgcolor="#FAFAFA"><s:date name="order.expectOutDate" format="yyyy-MM-dd"/></td>
		</tr>
      </table>
     </div>
     <div class="clear"></div>
	 <div class="main_1">
       <table width="99%" cellpadding="0" cellspacing="1" border="0" class="ksglxx2a">
        <tr class="ksglxx2bg">
          <th width="8%" >分类</th>
          <th width="8%" >品名</th>
          <th width="15%" >规格</th>
          <th width="6%" >代码</th>
          <th width="6%" >客户代码</th>
		  <th width="6%" align="left">数量</th>
		  <th width="6%" >单位</th>
		  <th align="left"></th>
		</tr>
		<s:iterator value="order.orderDetails" id="detail" status="st">
          <s:if test="#st.Odd">
            <tr class="odd">
              <td><s:property value="#detail.productCategory" /></td>
              <td><s:property value="#detail.productName" /></td>
              <td><s:property value="#detail.productType" /></td>
              <td><s:property value="#detail.productNo" /></td>
              <td><s:property value="#detail.customNo" /></td>
              <td><s:property value="#detail.number" /></td>
              <td><s:property value="#detail.unit" /></td>
              <td></td>
            </tr>
          </s:if>
          <s:else>
            <tr class="even">
              <td><s:property value="#detail.productCategory" /></td>
              <td><s:property value="#detail.productName" /></td>
              <td><s:property value="#detail.productType" /></td>
              <td><s:property value="#detail.productNo" /></td>
              <td><s:property value="#detail.customNo" /></td>
              <td><s:property value="#detail.number" /></td>
              <td><s:property value="#detail.unit" /></td>
              <td></td>
            </tr>
           </s:else>
		</s:iterator>
       </table>
     </div>
     <div class="clear"></div>
     <s:if test="order.planMaterials>0">
     <div class="main_1">
       <table width="99%" cellpadding="0" cellspacing="1" border="0" class="ksglxx2a">
         <tr>
           <td colspan="8" align="left" class="Blue14" bgcolor="#FAFAFA">已经计划原料需求信息</td>
         </tr>
          <tr class="ksglxx2bg">
             <th width="10%" >原料编号</th>
             <th width="8%" >原料分类</th>
             <th width="10%" >原料名称</th>
             <th width="20%" >属性描述</th>
             <th width="8%" >需求数量</th>
             <th width="8%" >单位</th>
             <th width="10%" >要求到货日期</th>
             <th >订单号</th>
          </tr>
		<s:iterator value="requestList" id="request" status="st">
          <s:if test="#st.Odd">
            <tr class="odd">
              <td><s:property value="#request.code" /></td>
              <td><s:property value="#request.category" /></td>
              <td><s:property value="#request.name" /></td>
              <td><s:property value="#request.property" /></td>
              <td><s:property value="#request.planNumber" /></td>
              <td><s:property value="#request.units" /></td>
              <td><s:date name="#request.finishDate" format="yyyy-MM-dd"/></td>
              <td><s:property value="#request.orderId" /></td>
            </tr>
          </s:if>
          <s:else>
            <tr class="even">
              <td><s:property value="#request.code" /></td>
              <td><s:property value="#request.category" /></td>
              <td><s:property value="#request.name" /></td>
              <td><s:property value="#request.property" /></td>
              <td><s:property value="#request.planNumber" /></td>
              <td><s:property value="#request.units" /></td>
              <td><s:date name="#request.finishDate" format="yyyy-MM-dd"/></td>
              <td><s:property value="#request.orderId" /></td>
            </tr>
           </s:else>
		</s:iterator>
       </table>
    </div>
    </s:if>
     <s:form action="saveMaterialsRequest">
     <s:hidden name="orderId" value="%{order.id}"></s:hidden>
     <div class="main_1">
       <table width="99%" cellpadding="0" cellspacing="1" border="0" class="ksglxx2a">
         <tr>
           <td colspan="10" align="left" class="Blue14" bgcolor="#FAFAFA">新增加计划原料需求信息</td>
         </tr>
        <tr class="ksglxx2bg">
          <th width="10%" >原料编码</th>
          <th width="10%" >原料分类</th>
          <th width="15%" >原料名称</th>
          <th width="20%" >属性描述</th>
          <th width="6%" >库存数量</th>
          <th width="6%" >安全库存</th>
		  <th width="5%" align="left">单位</th>
		  <th width="8%" align="left">计划采购数量</th>
		  <th width="8%" align="left">预计到货日期</th>
		  <th align="left">&nbsp;</th>
		</tr>
        <tr class="odd">
          <td><span id="materialsCodes-0"></span></td>
          <td><span id="materialsCategorysSpan-0"></span><s:hidden id="materialsCategorys-0" name="materialsCategorys" /></td>
          <td>
		       <s:textfield id="materialsNames-0" name="materialsNames" size="20" cssClass="{required:true,maxlength:20}"/>
		       <s:hidden id="materialsIds-0" name="materialsIds" />
          </td>
          <td><span id="materialsPropertys-0"></span></td>
          <td><span id="materialsNumbers-0"></span></td>
          <td><span id="materialsSafeNumbers-0"></span></td>
          <td><span id="materialsUnits-0"></span></td>
          <td>
    		<s:textfield id="planNumbers-0" name="planNumbers" size="10" 
					cssClass="{required:true,maxlength:10,number:true}" /></td>
		  <td><s:textfield id="finishDates-0" name="finishDates" size="10" 
		  			onclick="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly="true" cssClass="{required:true}"/></td>
          <td></td>
	    </tr>
        <tr>
         <td colspan="3" align="left" valign="top">
           <input type="button" value="添加" class="input1" onclick="addLine()" />
         </td>
        </tr>
       </table>
      </div>
     <div class="clear"></div>
	 <div class="main_1">
		<table width="98%" border="0" cellpadding="5" cellspacing="0" class="gr-text1">
		   <tr>
			 <td width="45%" align="right">
			   <s:submit value="保存" cssClass="input1" />&nbsp;&nbsp;
			   <input type="button" value="关闭" class="input1" onclick='javascript:window.location.href="purchaseOrderList.action"' /></td>
			 <td width="55%" align="left"></td>
		   </tr>
	   </table>
	</div>
	</s:form>
</BODY></HTML>
